.navbar-clay-site {
	background-color: $bg-color;
	padding: 7.5px 4px;
	position: static;

	a {
		@include focus-a11y;
	}

	&.scroll {
		background-color: $brand-dark;
		box-shadow: 0 2px 6px rgba(62, 28, 20, 0.2);
		padding: $base-size * 0.583;
	}

	.navbar-brand {
		span {
			font-size: 26px;
			font-weight: 700;
			line-height: 1;
		}

		@media (max-width: $grid-float-breakpoint - 1) {
			margin-left: auto;
			margin-right: auto;
		}
	}

	.navbar-nav .nav-link {
		font-weight: 600;

		.c-inner {
			margin-left: -0.5rem;
			margin-right: -0.5rem;
		}
	}

	.github-logo {
		height: 21px;
		width: 21px;
	}

	.logo {
		max-height: 32px;
	}
}

.navbar-fixed-clay-site {
	@media (min-width: $grid-float-breakpoint) {
		left: 320px;
		padding-left: 12px;
		padding-right: 12px;
		position: fixed;
		right: 0;
		top: 0;
		z-index: 10;
	}
}

.navbar-mobile {
	background-color: $brand-secondary;
	width: 100%;
	min-height: $base-size * 2.92;
	position: relative;
	z-index: 100;
	border-top: 1px solid rgba(0, 0, 0, 0.1);

	@media (min-width: $grid-float-breakpoint) {
		display: none;
	}

	.navbar-brand {
		color: $text-color;
	}

	.logo {
		max-height: 40px;
	}

	.navbar-toggler {
		color: white;
	}
}
